<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>角色列表</title>
	<meta name="renderer" content="webkit">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="format-detection" content="telephone=no">
	<link rel="stylesheet" href="plugins/layui/css/layui.css" media="all" />
	<link rel="stylesheet" href="//at.alicdn.com/t/font_tnyc012u2rlwstt9.css" media="all" />
</head>
<body class="childrenBody">
	<blockquote class="layui-elem-quote news_search">
	<!-- 	<form class="layui-form">
        <div class="layui-inline">
            <label class="layui-form-label">服务类别名称</label>
            <div class="layui-input-block">
                <input type="text" class="layui-input" name="categoryName" placeholder="请输入服务类别名称">
            </div>
        </div>
        <div class="layui-inline">
            <a class="layui-btn search_btn" lay-submit="" lay-filter="queryCategory">查询</a>
        </div>
        <div class="layui-inline">
           <a class="layui-btn layui-btn-normal categorysAdd_btn">添加服务类别</a>
        </div>
    </form> -->
    
     <div class="layui-inline">
           <a class="layui-btn layui-btn-normal resourcesAdd_btn">添加资源</a>
        </div>
		
	</blockquote>
	<div class="layui-form news_list">
	  	<table class="layui-table" id="resourceList" lay-filter="roles"></table>
	</div>
	<div id="page"></div>
	<script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>
	<script type="text/javascript" src="plugins/layui/layui.js"></script>
	<!-- <script type="text/javascript" src="js/user/newsList.js"></script> -->
	
	<script type="text/javascript" src="/js/jquery.ztree.core.js"></script>
	<script type="text/javascript" src="/js/jquery.ztree.excheck.js"></script>
	
		    <script type="text/html" id="barDemo">
	    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon"></i>删除</a>
	    
	    <!-- 这里同样支持 laytpl 语法，如： -->
	    {{#  if(d.auth > 2){ }}
	      <a class="layui-btn layui-btn-xs" lay-event="check">审核</a>
	    {{#  } }}
	  </script>
	<script type="text/javascript">
	//重新渲染表单
	function renderForm(){
	  layui.use('form', function(){
	   var form = layui.form;//高版本建议把括号去掉，有的低版本，需要加()
	   form.render();
	  });
	 }
	
	layui.use(['table','form'], function(){
	    var table = layui.table;
	    var form = layui.form;//高版本建议把括号去掉，有的低版本，需要加()

	    //方法级渲染
	    var tableIns=table.render({
	        elem: '#resourceList'
	        ,url: '/resources'
	        ,cols: [[
	            {checkbox: true, fixed: true}
	            ,{field:'id', title: 'ID', width:'10%', sort: true, fixed: true}
	            ,{field:'name', title: '资源名称',  width:'10%', sort: true}
	            ,{field:'parentid', title: '父资源',  width:'10%', sort: true}
	            ,{field:'resurl', title: '资源链接',  width:'10%', sort: true}
	            ,{field:'type', title: '资源类型',  width:'10%', sort: true}
	            ,{field:'sort', title: '排序',  width:'10%', sort: true}
	            ,{title: '操作',align:'center', toolbar: '#barDemo'} //这里的toolbar值是模板元素的选择器
	            /*  ,{field:'date', title: '日期', width:180}
	            ,{field:'datatype', title: '日期类型', width:100}*/
	        ]]
	        ,id: 'testReload'
	        ,page: true
	        ,height: 600
	    });
	   
	    
	    table.on('tool(roles)', function(obj){ //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
	    	  var data = obj.data; //获得当前行数据
	    	  var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
	    	  var tr = obj.tr; //获得当前行 tr 的DOM对象
	    	  if(layEvent === 'del'){ //删除
	    	    layer.confirm('真的删除该类别吗', function(index){
	    	      obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
	    	      layer.close(index);
	    	      //向服务端发送删除指令
	    	      var ids=obj.data.id;
	    	      $.ajax({  
	    	            type: "POST",  
	    	            url:"/categorys/delete",  
	    	            data:{id:ids},// 序列化表单值  
	    	            success: function(data1) {  
	    	            	if(data1=='success'){
	    	            		top.layer.close(index);
	    	          			top.layer.msg("删除成功");
	    	           		//	layer.closeAll("iframe");
	    	          	 		//刷新父页面
	    	          	 	//	parent.location.reload();
	    	            	}
	    	            } ,
	    	 		
	    		 		 error: function(request) {  
	    		             alert("Connection error");  
	    		         } 
	    	        }); 
	    	    });
	    	  } else if(layEvent === 'giveAuth'){
	    		  var ids=obj.data.id;
	    		  allotResources(ids);
	    	  }
	    	});
	});
	
	$(window).one("resize",function(){
		$(".categorysAdd_btn").click(function(){
			var index = layui.layer.open({
				title : "添加服务类别",
				type : 2,
				content : "categorys/categorysAdd.html",
				success : function(layero, index){
					
				}
			})			
			layui.layer.full(index);
		})
	}).resize();
	
	
	  //弹出选择角色的框
    var roleId;
    function allotResources(rid){
        roleId = rid;
        var setting = {
            check: {
                enable: true,
                chkboxType:  { "Y" : "p", "N" : "s" }
            },
            data: {
                simpleData: {
                    enable: true,
                    idKey: "id",
                    pIdKey: "parentid",
                }
            }
        };

        $.ajax({
            async:false,
            type : "POST",
            data:{rid:rid},
            url: "resources/resourcesWithSelected",
            dataType:'json',
            success: function(data){

                $.fn.zTree.init($("#treeDemo"), setting, data);
                var zTree = $.fn.zTree.getZTreeObj("treeDemo");
                zTree.expandAll(true);
                $('#selectResources').modal();
            }
        });

    }

	
	</script> 
</body>
</html>